.flex-container, .flexslider
  a
    &:active, &:focus
      outline: medium none

.slides, .flex-control-nav, .flex-direction-nav
  list-style: none outside none
  margin: 0
  padding: 0

.flexslider
  margin: 0
  padding: 0
  .slides
    > li
      display: none
    img
      display: block
      width: 100%

.flex-pauseplay span
  text-transform: capitalize

.slides:after
  clear: both
  content: "."
  display: block
  height: 0
  line-height: 0
  visibility: hidden

html[xmlns] .slides
  display: block

* html .slides
  height: 1%

.no-js .slides > li:first-child
  display: block

.flexslider
  position: relative

.loading .flex-viewport
  max-height: 300px

.flexslider .slides > li
  position: relative
  width: 940px
  z-index: 1

.flex-caption
  background-color: rgba(0, 0, 0, .55)
  bottom: 0
  color: #FFFFFF
  left: 0
  padding: 3%
  position: absolute
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3)
  width: 94%
  h3
    color: #9DCEDF
    margin: 0

.flex-direction-nav
  z-index: 3
  a
    background-color: rgba(204, 204, 204, 0.5)
    color: #FFFFFF
    cursor: pointer
    display: block
    font-size: 40px
    transition: background-color 0.2s linear 0s
    z-index: 10
  .flex-next, .flex-prev
    height: 25px
    line-height: 20px
    padding: 5px
    text-align: center
    width: 30px
  .flex-next
    float: right
    margin-right: 0
    margin-top: -30px
    position: relative
  .flex-prev
    float: left
    margin-left: 0
    margin-top: -30px
    position: relative
  li a:hover
    background-color: #1997C2
    border-bottom: medium none

.flexslider:hover
  .flex-next:hover, .flex-prev:hover
    opacity: 1

.flex-direction-nav .flex-disabled
  cursor: default
  opacity: 0.3 !important

.flex-control-nav
  display: block
  margin-top: 30px
  position: absolute
  text-align: center
  width: 100%
  bottom: 0px
  z-index: 99999
  li
    display: inline-block
    margin: 0 0 0 5px
    &:first-child
      margin: 0

.flex-control-paging 
  li 
    a
      background: url("../../images/inactive-slide.png") no-repeat scroll center center rgba(0, 0, 0, 0)
      display: inline-block
      height: 17px
      margin: 0
      outline: medium none
      padding: 0
      width: 17px
      cursor: pointer
      text-indent: -999em
      &:hover
        background: url("../../images/active-slide.png") no-repeat scroll center center rgba(0, 0, 0, 0)
      &.flex-active
        background: url("../../images/active-slide.png") no-repeat scroll center center rgba(0, 0, 0, 0)
        cursor: default

@media screen and (max-width: 860px)
  .flex-direction-nav
    .flex-prev
      left: 0
      opacity: 1
    .flex-next
      opacity: 1
      right: 0